<!DOCTYPE html>
<html lang="en">
<head>
<meta name="keywords"
	content="jQuery Splitter, Splitter Widget, Splitter, jqxSplitter" />
<meta name="description"
	content="This page demonstrates splitter's events" />
<title id='Description'>This demonstration shows how to create a
	splitter that fits the entire browser window's contents.</title>
<link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css"
	type="text/css" />
<script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxsplitter.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxpanel.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script>
<script type="text/javascript"
	src="../../jqwidgets/jqxgrid.selection.js"></script>
<script type="text/javascript"
	src="../../jqwidgets/jqxgrid.columnsresize.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxgrid.sort.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script>
<script type="text/javascript">
	$(document).ready(
			function() {

				$('#splitter').jqxSplitter({
					width : '100%',
					height : '100%',
					panels : [ {
						size : '20%',
						min : 150
					}, {
						size : '80%',
						min : 250
					} ]
				});
				
				$("#jqxgrid").load("bindingtojson.htm");
			});
</script>
<style type="text/css">
html,body {
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}
</style>
</head>
<body>
	<div id='toppage' style="height:50px; background-color:#FFC;">fksdajdlajl</div>
	<div id='splitter'>
		<div>123</div>
		<div>
			<div id='jq2'></div>
			<div id='jqxgrid'></div>
		</div>
	</div>
	<div id='footpage'
		style="position: relative; margin-top: -80px; height: 60px; clear:both; background:#369; text-align:center">
		copyright::</div>
</body>
</html>